import React from 'react';
import {inject, observer} from 'mobx-react';
import { Button, Modal,message} from 'antd';
import {
  WeaDatePicker,
  WeaSearchGroup,
  WeaFormItem,
  WeaInput,
  WeaLocaleProvider
} from 'ecCom';
import * as Util from '../../../util/Util';
const toJS = mobx.toJS;
const getLabel = WeaLocaleProvider.getLabel;
@inject ('planProgramViewStore')
@observer
export default class EditPlanModal extends React.Component {
  constructor (props) {
    super (props);
    this.state = {
      formValue: {
        //编辑的数据
        id: 'temp+' + new Date ().getTime (),
      },
    };
    this.store = this.props.planProgramViewStore;
  }

  componentWillReceiveProps (nextProps) {}

  setFormValueId = () => {
    let {formValue} = this.state;
    formValue['id'] = 'temp+' + new Date ().getTime ();
    this.setState (formValue);
  };

  resetFileds = () => {
    this.setState ({
      formValue: {
        id: 'temp+' + new Date ().getTime (),
      },
    });
  };

  handleOk = () => {
    let ismustFlag = this.checkIsmust()
    if(ismustFlag){
      message.info(getLabel('509065','请输入必填项'))
      return
    }
    this.updateDataFromArray (this.store.planDefaultRows, this.state.formValue);
    this.handleCancel ();
    this.setFormValueId ();
  };

  checkIsmust=()=>{
    const {formValue} =  this.state
    const {planPreColumns}= this.store 
    let ismustList = []
    planPreColumns.map(v=>{
      if(v.ismust2==1){
        ismustList.push(v.dataIndex)
      }
    })
    let ismustFlag = false
    if(ismustList.length>0){
      ismustList.map(v=>{
         if(!formValue[v] || formValue[v]==''){
          ismustFlag=true
         }
      })
    }
    return ismustFlag
  }



  updateDataFromArray (array, formValue) {
    let index = -1;
    array.map ((v, i) => {
      if (v.id == formValue.id) {
        index = i;
      }
    });
    if (index > -1) {
      array[index] = formValue;
    } else {
      array.push (formValue);
    }
  }

  handleCancel = () => {
    this.store.editModal.isShow = false;
    this.resetFileds ();
  };

  onInputChange = (fieldname, e) => {
    let {formValue} = this.state;
    formValue[fieldname] = e;
    this.setState ({formValue});
  };

  onDateChange = (fieldname,e)=>{ 
    let {formValue} = this.state;

    let col, tip = ''; //被改变的值
    let days = 0;
    let flag = true;
    if (
      fieldname == 'begindate2' &&
      formValue['enddate2'] &&
      formValue['enddate2'] != ''
    ) {
      days = Util.DateDiffDays (e, formValue['enddate2']);
      if (days < 0) {
        flag = false;
        tip = getLabel('509026','实际开始日期不能大于实际结束日期!') ;
      } else {
        col = 'days2';
      }
    } else if (
      fieldname == 'enddate2' &&
      formValue['begindate2'] &&
      formValue['begindate2'] != ''
    ) {
      days = Util.DateDiffDays (formValue['begindate2'], e);
      if (days < 0) {
        flag = false;
        tip = getLabel('509027','实际结束日期不能小于实际开始日期!') ;
      } else {
        col = 'days2';
      }
    } else if (
      fieldname == 'begindate1' &&
      formValue['enddate1'] &&
      formValue['enddate1'] != ''
    ) {
      days = Util.DateDiffDays (e, formValue['enddate1']);
      if (days < 0) {
        flag = false;
        tip = getLabel('509028','计划开始日期不能大于计划结束日期!') ;
      } else {
        col = 'days1';
      }
    } else if (
      fieldname == 'enddate1' &&
      formValue['begindate1'] &&
      formValue['begindate1'] != ''
    ) {
      days = Util.DateDiffDays (formValue['begindate1'], e);
      if (days < 0) {
        flag = false;
        tip = getLabel('509029','计划结束日期不能小于计划开始日期!') ;
      } else {
        col = 'days1';
      }
    }
    if (col != '') {
      formValue[col] = days?days:'';
    }
    if (flag) {
      formValue[fieldname] = e;
      this.setState ({formValue});
    } else {
      message.info (tip);
      this.setState ({formValue});
    }
  }


  getFormItem = (title, key, value, fieldname,ismust) => {
    return (
      <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@d75kkr`}
        label={title}
        labelCol={{span: 6}}
        wrapperCol={{span: 18}}
      >
        {key.indexOf ('date') > -1
          ? <WeaDatePicker ecId={`${this && this.props && this.props.ecId || ''}_WeaDatePicker@llyu0w`}
              value={value}
              viewAttr={ismust=='1'?3:2}
              onChange={e => this.onDateChange (fieldname, e)}
            />
          : <WeaInput ecId={`${this && this.props && this.props.ecId || ''}_WeaInput@gzphwl`}
              value={value}
              viewAttr={ismust=='1'?3:2}
              onChange={e => this.onInputChange (fieldname, e)}
            />}

      </WeaFormItem>
    );
  };

  render () {
    let {editModal,} = this.store;
    let {formValue} = this.state;

    //如果是点击已有的行
    if (editModal.editData.id) {
      this.setState ({formValue: toJS (editModal.editData)}, () => {
        editModal.editData = {};
      });
    }

    return (
      <div>
        <Modal ecId={`${this && this.props && this.props.ecId || ''}_Modal@kw6mxq`}
          title={getLabel('509071','默认计划') }
          maskClosable={false}
          visible={editModal.isShow}
          onOk={this.handleOk}
          onCancel={this.handleCancel}
          footer={<div><Button ecId={`${this && this.props && this.props.ecId || ''}_Button@0p3no7`} type="primary" onClick={this.handleOk}>{getLabel('826','确定') }</Button><Button ecId={`${this && this.props && this.props.ecId || ''}_Button@aihta1`}  type="primary" onClick={this.handleCancel}>{getLabel('309','关闭') }</Button></div>}
        >
          <div>
            <WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@a3eklg`} showGroup={true}>
              {toJS (this.store.planPreColumns).map ((v, i) => {
                return this.getFormItem (
                  v.title,
                  v.dataIndex,
                  formValue[v.key],
                  v.key,
                  v.ismust2
                );
              })}
            </WeaSearchGroup>
          </div>

        </Modal>
      </div>
    );
  }
}
